{% extends "blog/base.html" %}

{% block blog_content %}
<h3>Blog Categories</h3>

<div class="row">
    {% for category in categories %}
        <div class="col-md-4 mb-4">
            <div class="card">
                <div class="card-body">
                    <h5 class="card-title">{{ category.name }}</h5>
                    <p class="card-text">{{ category.description }}</p>
                    <p><strong>Posts:</strong> {{ category.post_count }}</p>
                    <a href="{{ url_for('blog.category', category_id=loop.index) }}" class="btn btn-primary">View Posts</a>
                </div>
            </div>
        </div>
    {% endfor %}
</div>

<div class="card">
    <div class="card-header">
        <h5>Category Management</h5>
    </div>
    <div class="card-body">
        <p>Categories help organize blog posts by topic, making it easier for readers to find content they're interested in.</p>
        <p>In a real application, administrators would be able to:</p>
        <ul>
            <li>Create new categories</li>
            <li>Edit existing categories</li>
            <li>Delete unused categories</li>
            <li>Reorganize posts between categories</li>
        </ul>
        <a href="{{ url_for('admin.posts') }}" class="btn btn-secondary">Manage Categories (Admin)</a>
    </div>
</div>
{% endblock %}